<!doctype html>
<html>
  <head>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;600&family=Roboto+Mono&display=swap" rel="stylesheet">
    <script type="module" src="../rapidoc-min.js"></script>
    <style>
      rapi-doc{
        width:100%;
      }
    </style>
  </head>
  <body>
    <rapi-doc id="thedoc" render-style = "read" allow-try="false" allow-authentication = "false" regular-font="Open Sans" mono-font = "Roboto Mono"> </rapi-doc>
    
    <script>
      document.addEventListener('DOMContentLoaded', (event) => {
        let docEl = document.getElementById("thedoc");
        let strSpec = `
        {
          "swagger": "2.0",
          "info": { 
          },
          "paths": {
            "/JSON": {
              "get": {
                "summary": "Creating spec from JSON Object",
                "description": "This spec is created dynamically from a JSON object For code refer https://github.com/rapi-doc/RapiDoc/blob/master/docs/examples/example9.html",
                "produces": [ "application/json"],
                "responses": {
                  "200": {
                    "description": "A list of pets.",
                    "schema": {
                      "type": "array",
                      "items": {
                        "$ref": "#/definitions/Pet"
                      }
                    }
                  }
                }
              }
            }
          },
          "definitions": {
            "Pet": {
              "type": "object",
              "properties": {
                "id"  : { "type": "integer" },
                "name": { "type": "string" },
                "tag" : { "type": "string" }
              }
            }
          }
        }  
        `;
        let objSpec = JSON.parse(strSpec);
        docEl.loadSpec(objSpec);
      })
    </script>
  </body>


</html>